﻿<? include('common/inc.init.php');
$proyectoMainObj = new proyectos();
$proyectoMainObj->setDBLink($dbLink);
if(!$proyectoMainObj->get((int)$_GET['proyectoID'])) 
{
    header("Location:".$GLOBALS['CONF']['url']['root']);
}
$htmlTitle = $proyectoMainObj->html_meta_title." | Revoluci&oacute;n Pelota";
$htmlKeywords  = $proyectoMainObj->html_meta_keywords;
$htmlDescription= $proyectoMainObj->html_meta_description;

$sqlImage = "SELECT itemID FROM file_manager_item WHERE file_managerID=".$proyectoMainObj->photo_albumID." ORDER BY `order` LIMIT 1";
list($firstImageID) = mysql_fetch_array(mysql_query($sqlImage, $dbLink));
$firstImage= new FileManagerItemImage();
$firstImage->setDBLink($dbLink);
if($firstImage->get($firstImageID))
{
    $imageToShare = $firstImage->getImageUrl();
}

?>
<!DOCTYPE html>
<head>
    <title><?=$proyectoMainObj->html_meta_title?> | Revoluci&oacute;n Pelota</title>
    <?php include(DIR_ROOT.'/common/head.php'); ?>
</head>
<body>
    <div id="fb-root"></div>
    <script>(function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/es_LA/all.js#xfbml=1&appId=235318086626338";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>
    
    <!-- TOP NAVIGATION BAR -->
<main class="main-content">
    <?php include(DIR_ROOT.'/common/top-nav.php'); ?>
    <!-- BANNER -->
    <div class="banner-small" style="background-image: url('<?= $firstImage->getImageUrl(); ?>');">
        <div class="overlay">
            <div class="center">
                <hgroup>
                    <h1><?=$proyectoMainObj->nombre?></h1>
                    <h5><?=$proyectoMainObj->direccion?></h5>
                </hgroup>
            </div><!--
            --><span></span>
        </div>
    </div>
    <?
    $sqlImages = "SELECT itemID FROM file_manager_item WHERE file_managerID=".$proyectoMainObj->photo_albumID." ORDER BY `order`";
    $resImages = mysql_query($sqlImages, $dbLink);
    if(mysql_num_rows($resImages))    
    {
        ?>
        <div class="banner-large">
            <div class="row">
                <div class="small-12 columns">
                    <div class="loader"><img src="<?=$GLOBALS['CONF']['url']['url']?>/img/loader.gif" alt="" /><span></span></div>
                    <div id="cbp-fwslider" class="cbp-fwslider proj">
                        <ul>
                            <?
                                $first = true;
                                while($rowItem = mysql_fetch_assoc($resImages))
                                {
                                    $item = new FileManagerItemImage();
                                    $item->setDBLink($dbLink);
                                    $item->get($rowItem['itemID']);
                                    ?>
                                    <li>
                                        <div>
                                            <img src="about:blank" class="img-desktop" data-desktop="<?=$item->getImageUrl()?>" alt="" />
                                            <?
                                                if($first)
                                                {
                                                    ?>
                                                    <div class="over-img">
                                                        <div class="center">
                                                            <hgroup>
                                                                <h1><?=$proyectoMainObj->nombre?></h1>
                                                                <h5><?=$proyectoMainObj->direccion?></h5>
                                                            </hgroup>
                                                        </div><!--
                                                        --><span></span>
                                                    </div>
                                                    <?
                                                    $first=false;
                                                }
                                            ?>
                                        </div>
                                    </li>
                                    <?
                                }
                            ?>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <?
    }
    ?>
    <!-- CUERPO PRINCIPAL DEL PROYECTO -->
    <section class="project-body">
        <div class="row">
            <div class="small-12 medium-8 columns">
                <main>
                    <h5><?=$proyectoMainObj->nota_titulo?></h5>
                    <p><?=$proyectoMainObj->nota_descripcion?></p>
                    <?
                        if($proyectoMainObj->html_video_embed != '')
                        {
                            ?>
                            <div class="yt-container"><?=$proyectoMainObj->html_video_embed?></div>
                            <?
                        }
                    ?>
                </main>
            </div>
            <div class="small-12 medium-4 columns">
                <aside>
                    <?
                    if($proyectoMainObj->direccion != '')
                    {
                        ?>
                        <div class="stat">
                            <i class="rp-sprite icon1"></i>
                            <h4>UBICACI&oacute;N</h4>
                            <p><?=strtoupper($proyectoMainObj->direccion)?></p>
                        </div>
                        <?
                    }
                    ?>
                    <?
                    if($proyectoMainObj->km != '' && $proyectoMainObj->km > 0)
                    {
                        ?>
                        <div class="stat">
                            <i class="rp-sprite icon2"></i>
                            <h4>KIL&oacute;METROS RECORRIDOS</h4>
                            <p><?=$proyectoMainObj->km?></p>
                        </div>
                        <?
                    }
                    ?>
                    <?
                    if($proyectoMainObj->ninos_involucrados != '' && $proyectoMainObj->ninos_involucrados >0)
                    {
                        ?>
                        <div class="stat">
                            <i class="rp-sprite icon3"></i>
                            <h4>ALCANCE DE NI&Ntilde;OS INVOLUCRADOS</h4>
                            <p><?=$proyectoMainObj->ninos_involucrados?></p>
                        </div>
                        <?
                    }
                    ?>
                    <?
                    if($proyectoMainObj->pelotas_repartidas != '' && $proyectoMainObj->pelotas_repartidas > 0)
                    {
                        ?>
                        <div class="stat">
                            <i class="rp-sprite icon4"></i>
                            <h4>PELOTAS REPARTIDAS</h4>
                            <p><?=$proyectoMainObj->pelotas_repartidas?></p>
                        </div>
                        <?
                    }
                    ?>
                    <?
                    if($proyectoMainObj->paises_recorridos != '' && $proyectoMainObj->paises_recorridos > 0)
                    {
                        ?>
                        <div class="stat">
                            <i class="rp-sprite icon5"></i>
                            <h4>PAISES RECORRIDOS</h4>
                            <p><?=$proyectoMainObj->paises_recorridos ?></p>
                        </div>
                        <?
                    }
                    ?>
                    <?
                    if($proyectoMainObj->acciones_elementos_deportivos != '')
                    {
                        ?>
                        <div class="stat">
                            <i class="rp-sprite icon6"></i>
                            <h4>ACCIONES / ELEMENTOS DEPORTIVOS</h4>
                            <p><?=strtoupper($proyectoMainObj->acciones_elementos_deportivos)?></p>
                        </div>
                        <?
                    }
                    ?>
                    <?
                    if($proyectoMainObj->personas_involucradas != '' && $proyectoMainObj->personas_involucradas>0)
                    {
                        ?>
                        <div class="stat">
                            <i class="rp-sprite icon7"></i>
                            <h4>PERSONAS DE LA COMUNIDAD INVOLUCRADAS</h4>
                            <p><?=$proyectoMainObj->personas_involucradas?></p>
                        </div>
                        <?
                    }
                    ?>
                    <div id="map-canvas"></div>
                    <div class="project-sponsors">
                        <?
                            if($proyectoMainObj->sponsor=='ideame')
                            {
                                ?><img src="<?=$GLOBALS['CONF']['url']['root']?>/img/sponsors/ideame.png" alt="Ideame" /><?
                            }
                            else $proyectoMainObj->printImageHTML('sponsor');
                        ?>
                    </div>
                        <?
                            if($proyectoMainObj->sponsor=='ideame')
                            {
                                ?><a href="<?=$proyectoMainObj->link_sponsor?>" target="_blank" class="colabora">Colabor&aacute; haciendo click aqu&iacute;</a><?
                            }
                        ?>
                        <div class="fb-share-button" data-href="http://<?=$_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"]?>" data-type="button_count"></div>
                </aside>
            </div>
        </div>
    </section>

    <hr />

    <!-- PROYECTOS -->
    <section class="project-index">
        <div class="row">
            <h4>PROYECTOS</h4>
            <p class="sub-header">
                Buscamos generar un cambio social a trav&eacute;s del f&uacute;tbol. <br/>
                Para lograrlo, promovemos la recuperaci&oacute;n y desarrollo de potreros.
            </p>
            <?php include(DIR_ROOT.'/common/projects.php') ?>
        </div>
    </section>

<?php include(DIR_ROOT.'/common/footer.php'); ?>
</main>

<?php include(DIR_ROOT.'/common/scripts.php'); ?>
<script src="<?=$GLOBALS['CONF']['url']['root']?>/js/cd-slider.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>


    // SLIDER PRELOADER
    $(window).on('load', function() {
        $('.loader').animate({opacity: 0}, 500);
        $('#cbp-fwslider').delay(500).animate({opacity: 1}, 500);
    });
    
    // SLIDER
    $(function() {
        $('#cbp-fwslider').cbpFWSlider();
    });
    
    var speed = 6000; // delay of rotation
    setInterval(function() {
        if($('.cbp-fwnext').css('display') != 'none'){
        $('.cbp-fwnext').click();
    }
        else jQuery('.cbp-fwdots span:first-child').click();
    }, speed);

    // UBICACION POTRERO
    function initialize() {
        var mapOptions = {
            zoom: 16,
            center: new google.maps.LatLng(<?=$proyectoMainObj->lat?>, <?=$proyectoMainObj->lng?>),
            panControl: false,
            zoomControl: false,
            maptypecontrol: false,
            scrollwheel: false,
            streetViewControl: false,
            overviewMapControl: false,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(document.getElementById('map-canvas'),
                mapOptions);

        var myLatLng = new google.maps.LatLng(<?=$proyectoMainObj->lat?>, <?=$proyectoMainObj->lng?>);
        var beachMarker = new google.maps.Marker({
            position: myLatLng,
            map: map,
        });
        google.maps.event.addDomListener(window, 'resize', function() {
            map.setCenter(myLatLng);
        });
    }

    google.maps.event.addDomListener(window, 'load', initialize);
</script>
</body>
